<script type="text/javascript" src="{$CONTEXT.URLBASE}js/jquery/jquery-1.4.2.min.js"></script>
<link rel="stylesheet" type="text/css" href="{$CONTEXT.URLBASE}/js/albumslider/albumslider.css">
<script type="text/javascript" src="{$CONTEXT.URLBASE}js/albumslider/jquery.albumslider.js"></script>

<div class="albumslider-container" id="albumslider">
<div class="albumslider-image"></div>
<div class="albumslider-overlay"></div>

<div class="albumslider-nav">
<div class="albumslider-nav-left">&lt;</div>
<div class="albumslider-nav-items">
<ul>
{section name=item loop=$CONTENT.items}
<li>
<div class="albumslider-nav-items-img">{pp_pimage src=$CONTENT.items[item].value eid=$CONTENT.items[item].id url=$CONTEXT.URLBASE path_prefix="===CONFIG_DIR_UPLOADS_THUMBS" width=$CONTENT.items[item].width height=$CONTENT.items[item].height lw="100" lh="100" title=$CONTENT.items[item].name}</div>
<div class="albumslider-nav-items-desc">{$CONTENT.items[item].name} {$CONTENT.items[item].description}</div>
</li>
{/section}
</ul>
</div>
<div class="albumslider-nav-right">&gt;</div>
<div class="albumslider-nav-bar"></div>
</div>
</div>

{literal}
<script type="text/javascript" language="javascript">
$(document).ready(function(){
		$('#albumslider').albumslider();
});
</script>
{/literal}